import { ref, computed, watch, reactive } from "vue";
import { defineStore } from "pinia";
import { useMenuStore } from "@/stores/menu";
import { useRouter } from "vue-router";

export const useTabStore = defineStore("tab", () => {
  const menuStore = useMenuStore();
  const router = useRouter();

  const tabList = ref<any[]>([]);
  const actvieTab = ref("");

  const addTab = (tab: any) => {
    actvieTab.value = tab.fullPath;

    menuStore.setSelectedKeys(tab.fullPath);

    for (let item of tabList.value) {
      if (tab.fullPath == item.fullPath) {
        return;
      }
    }
    tabList.value.push(tab);
  };

  const removeTab = (url: string) => {
    if (tabList.value.length <= 1) {
      return;
    }

    for (let i = 0; i < tabList.value.length; i++) {
      if (url == tabList.value[i].fullPath) {
        tabList.value.splice(i, 1);
      }
    }

    if (router.currentRoute.value.fullPath == url) {
      // addTab(tabList[tabList.length - 1])
      router.push(tabList.value[tabList.value.length - 1].fullPath);
    }
  };

  const removeOther = (url: string) => {
    for(let i = tabList.value.length - 1; i >= 0; i--){
      if (url == tabList.value[i].fullPath) {
        
      } else {
        tabList.value.splice(i, 1);
      }
    }
  }

  const removeAll = () => {
    tabList.value = []
  }

  return { tabList, actvieTab, addTab, removeTab, removeOther, removeAll };
});
